import { Meta } from "@storybook/addon-docs";

<Meta title="Design-system/Theme/Tokens/Typography" />

# Typography

To work with typography, we offer a [Text component](/?path=/docs/design-system-widgets-text--text).
This component provides a <code>variant</code> prop for semantic options.
You can use the `type` prop to control the component's color in accordance with the theme.

To control the font size and line height, we use the `capHeight`and `lineGap` parameter supplied by the [capsize](https://seek-oss.github.io/capsize/) library.

For font sizes, we also use a approach based on the root unit and viewport calculation.
